<!--
 * @Author: wuheng wuheng@szhbzc.com
 * @Date: 2025-01-03 15:40:55
 * @LastEditors: wuheng wuheng@szhbzc.com
 * @LastEditTime: 2025-02-19 10:25:45
 * @FilePath: \web-appc:\Users\wuheng\Desktop\WugangNew\src\centerViews\purchasing\priceupdates\components\viewDetail.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div>
    <pb-drawer v-model="isVisible" :title="'查看价格批次'" :direction="'btt'" :size="'92%'" @cancelFn="CancelFn">
      <searchCard @onSearch="searchFn" :Resetshow="false" class="p-t6" @onReset="resetFn">
        <el-form :model="viewdetailFrom" label-width="auto" inline @keyup.enter="searchFn">
          <el-form-item label="SKU名称：">
            <pb-input v-model="viewdetailFrom.skuName" placeholder="请输入SKU名称"></pb-input>
          </el-form-item>
          <el-form-item label="外部编码：">
            <pb-input v-model="viewdetailFrom.externalCode" placeholder="请输入外部编码"></pb-input>
          </el-form-item>
        </el-form>
      </searchCard>
      <pb-table :column="detailColumn" :tableData="detailData" :bottomElement="['pb-page']" :indexWidth="60">
      </pb-table>
      <pb-pagination v-model:currentPage="pages.currentPage" v-model:pageSize="pages.pageSize" @onChange="onPagesChange"
        :total="pages.total"></pb-pagination>
      <template #footer></template>
    </pb-drawer>
  </div>
</template>
<script setup lang="ts">
import { GetNewestdetailsListApi } from '@/api/Purchasing'
const emit = defineEmits(['offisVisibleFn'])
const props = defineProps({
  isVisible: {
    type: Boolean,
    default: false
  },
  detailFrom: {
    type: Object,
    default: {}
  }
})
const pageInit = () => ({
  total: 0,
  currentPage: 1,
  pageSize: 10,
});
const pages = ref(pageInit());
const onPagesChange = () => {
  getDetailListFn()
}
const resetFn = () => {
  viewdetailFrom.skuName = ''
  viewdetailFrom.externalCode = ''
  getDetailListFn()
}
const isVisible = ref(false)
watch(
  () => props.isVisible,
  (val) => {
    if (val) {
      Object.assign(viewdetailFrom, {
        skuName: '',
        externalCode: ''
      })
      getDetailListFn()
    }
    isVisible.value = val
  }
)
const detailData = ref([] as any)
const viewdetailFrom = reactive({
  skuName: '',
  externalCode: ''
})
const detailColumn = [
  {
    key: "externalCode",
    name: "外部编码",
    align: "right",
  },
  {
    key: "skuName",
    name: "SKU名称",
  },
  {
    key: "accountingUnitName",
    name: "计量单位",
  },
  {
    key: 'price',
    name: "非税价格(元)",
    align: "right",
  }, {
    key: 'specifications',
    name: "规格",
  }, {
    key: 'smallOrderQuantity',
    name: "最小订货数量",
    align: "right",
  }, {
    key: 'taxPrice',
    name: "含税价格(元)",
    align: "right",
  }, {
    key: 'taxRate',
    name: "税率",
    align: "right",
  },
  {
    key: 'orderQuantization',
    name: '订货取整',
    align: "right",
  }
]
const CancelFn = () => {
  emit('offisVisibleFn')
}
const searchFn = () => {
  getDetailListFn()
}
const getDetailListFn = () => {
  GetNewestdetailsListApi({
    "currentPage": pages.value.currentPage,
    "pageSize": pages.value.pageSize,
    "sortingFields": [
      {
        "field": "",
        "order": ""
      }
    ],
    "skuSupplyId": props.detailFrom.skuSupplyId,
    "skuName": viewdetailFrom.skuName,
    "externalCode": viewdetailFrom.externalCode
  }).then(res => {
    detailData.value = res.data.records
    pages.value.total = res.data.total
  })
}
</script>
<style lang="scss" scoped></style>
